<template>
	<view>
		<view class="zxTcName spaceBet">
			<view class="tcName">{{zxTcInfo.tcName}}</view>
			<view class="tcTimes">共计<text class="timesNum">{{zxTcInfo.tcTimes}}</text>节</view>
		</view>
		<view class="tcYy spaceBet">
			<view class="remainTimes">剩余次数<text class="timesNum remainColor">{{zxTcInfo.restTimes}}</text>次</view>
			<view class="tcYyBtn" @tap="goZxTcYy">确认预约</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			zxTcInfo:Object
		},
		methods:{
			goZxTcYy(){
				this.$emit("goZxTcYy")
			}
		}
	}
</script>

<style lang="scss" scoped>
	.comTcYyStyle{
		background: #fff;
		align-items: center;
		padding: 0 30rpx;
	}
	.zxTcName{
		height: 90rpx;
		border-bottom: 1rpx solid #EFEFEF;
		font-size: 28rpx;
		color: $pss-text-color3;
		@extend .comTcYyStyle;
		.tcTimes{
			color: $pss-text-color8;
			font-size: 26rpx;
			flex-shrink: 0;
			margin-left: 15rpx;
		}
	}
	.timesNum{
		margin: 0 5rpx;
		&.remainColor{
			color: #EB3838;
			font-weight: 600;
			font-size: 32rpx;
		}
	}
	.tcYy{
		height: 128rpx;
		@extend .comTcYyStyle;
		.remainTimes{
			font-size: 26rpx;
			color: $pss-text-color3;
		}
		.tcYyBtn{
			width: 200rpx;
			height: 68rpx;
			line-height: 68rpx;
			border-radius: 50rpx;
			background:$pss-color-primary_1;
			text-align: center;
			font-size: 28rpx;
			color: #fff;
		}
	}
</style>